<route>
{
  "alias": "/error"
}
</route>
<template>
  <div class="app-error">
    <el-result icon="error" :title="$t('sys.error')" :subTitle="error">
      <!-- <template slot="extra">
        <el-button type="primary" size="medium" @click="back">{{
          $t("sys.returnToLoginPage")
        }}</el-button>
      </template> -->
    </el-result>
  </div>
</template>

<script>
export default {
  layout: "formlayout",
  components: {},
  data() {
    return {
      error: "抱歉，出错了",
    };
  },
  computed: {},
  async created() {
    this.init();
  },
  methods: {
    init() {
      let query = this.getQueryParameters();
      this.error = query.error || "抱歉，出错了";
    },
    getQueryParameters() {
      const url = window.location.href;
      const search = url.split("?")[1];
      if (!search) {
        return {};
      }
      return JSON.parse(
        `{"${decodeURIComponent(search)
          .replace(/"/g, '\\"')
          .replace(/&/g, '","')
          .replace(/=/g, '":"')}"}`
      );
    },
    back() {
      this.$router.replace({
        path: "/",
      });
    },
  },
};
</script>

<style lang="scss" scoped>
$themeColor: #2e46b0;

.app-error {
  height: 100vh;
  width: 100vw;
  overflow: hidden;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  ::v-deep .el-result__title {
    p {
      font-size: 22px;
    }
  }
  ::v-deep .el-result__subtitle {
    p {
      font-size: 16px;
    }
  }
}
</style>
